<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	</body>
</html>
<script type="text/javascript">
	// 定义网络图转base64的方法
	function getBase64(url, ext, callback) {
	    var canvas = document.createElement("canvas");   //创建canvas DOM元素
	    var ctx = canvas.getContext("2d");
	    var img = new Image;
	    img.crossOrigin = 'Anonymous';
	    img.src = url;
	    img.onload = function () {
	        canvas.width = img.width; //指定画板的宽度，自定义
	        canvas.height = img.height; //指定画板的高度,自定义
	        ctx.drawImage(img, 0, 0, img.width, img.height); //参数可自定义
	        var dataURL = canvas.toDataURL("image/" + ext);
	        callback.call(this, dataURL); //回掉函数获取Base64编码
	        canvas = null;
	    };
	}
	
	// 方法的调用
	var imgUrl = 'https://img.kags.cn/static/imgv4/dfhzs/df_small.jpg';
	getBase64(imgUrl, 'png', function(base64){
	    // 给原生img对象的src属性赋值
	    img.src = base64;
	})
</script>